:root {
  --base: 255, 255, 255;
  --base-reverse: 0, 0, 0;
  --color-primary: #18a058;
  --color-primary-hover: #36ad6a;
  --color-success: #63e2b7;
  --color-warning: #f0a020;
  --color-warning-hover: #fcb040;
  --color-danger: #d03050;
  --color-danger-hover: #de576d;
  --color-info: #2080f0;
  --color-info-hover: #4098fc;
  --color-text-primary: #ffffff;
  --color-text-regular: #dedede;
  --color-text-secondary: #d9d9d9;
  --color-text-placeholder: #bfbfbf;
  --background-color-base: #18181c;
  --border-color-light: #e4e4e4;
  --text-color-disabled: rgba(255, 255, 255, 0.05);
  --color-base: rgba(var(--base), 0.8);
  --el-fill-color-blank: transparent;
  --el-text-color-primary: rgba(var(--base), 0.6);
  --el-text-color-regular: var(--color-base);
  --el-color-primary: var(--color-primary);
  --el-border-color-hover: var(--color-primary);
  --el-border-color-light: rgba(var(--base), 0.1);
  --el-color-primary-light-3: var(--color-primary-hover);
}
html[data-theme='light'] {
  --base: 0, 0, 0;
  --base-reverse: 255, 255, 255;
  --background-color-base: #fff;
  --text-color-disabled: rgba(255, 255, 255, 0.38);
  --color-base: var(--background-color-base);
  --el-fill-color-blank: transparent;
  --el-text-color-primary: rgba(var(--base), 0.6);
  --el-text-color-regular: var(--color-base);
  --color-text-regular: #333;
  --el-color-info: #333;
}
body {
  background: var(--background-color-base);
}
body ::-webkit-scrollbar {
  width: 6px;
  height: 6px;
  background-color: rgba(var(--base), 0.05);
}
body ::-webkit-scrollbar-track {
  border-radius: 0;
  background-color: var(--background-color-base);
  box-shadow: 0 0 6px rgba(var(--base), 0.1) inset;
}
body ::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: var(--color-primary);
}
body ::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-primary-hover);
}
body .el-loading-mask {
  background-color: rgba(var(--base-reverse), 0.5);
}
body .el-empty {
  opacity: 0.5;
}
body .el-header {
  box-shadow: 0 0 5px rgba(var(--base), 0.05);
}
body .el-message-box__wrapper .el-message-box {
  border-color: rgba(var(--base), 0.1);
  background-color: #18181c;
}
body .el-select .el-input__inner {
  background-color: var(--background-color-base);
  color: rgba(var(--base), 0.8);
}
body .el-select-dropdown {
  background-color: var(--background-color-base);
}
body .el-select-dropdown__item {
  color: rgba(var(--base), 0.8);
}
body .el-select-dropdown__item.selected {
  color: var(--color-primary);
}
body .el-select-dropdown .el-select-dropdown__item.hover,
body .el-select-dropdown .el-select-dropdown__item:hover {
  background-color: rgba(var(--base), 0.15);
}
body .el-select-dropdown.el-popper[x-placement^='bottom'] .popper__arrow {
  border-bottom-color: rgba(var(--base), 0.15);
}
body .el-select-dropdown.el-popper[x-placement^='bottom'] .popper__arrow:after {
  border-bottom-color: var(--background-color-base);
}
body .el-input.is-disabled .el-input__inner {
  background-color: var(--text-color-disabled);
  border-color: transparent;
}
body .el-textarea__inner {
  background-color: var(--background-color-base);
  border: 1px solid rgba(var(--base), 0.1);
  color: rgba(var(--base), 0.8);
}
body .el-textarea__inner:hover,
body .el-textarea__inner:focus {
  border-color: var(--color-primary);
}
body .el-input__inner {
  background-color: var(--backgroundColor);
  color: rgba(var(--base), 0.9);
  border-color: var(--inputBorderColor);
}
body .el-radio-button__orig-radio:checked + .el-radio-button__inner {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-text-primary);
}
body .el-radio-button__inner:hover {
  color: var(--color-primary);
}
body .el-table {
  background-color: transparent;
  color: rgba(var(--base), 0.8);
}
body .el-table__expanded-cell,
body .el-table tr {
  background-color: transparent;
}
body .el-table th.el-table__cell {
  background-color: rgba(var(--base), 0.08);
}
body .el-table tr.el-table__row--striped td.el-table__cell {
  background-color: rgba(var(--base), 0.03);
}
body .el-table.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
  background-color: rgba(var(--base), 0.03);
}
body .el-table--border,
body .el-table--group,
body .el-table td.el-table__cell,
body .el-table th.el-table__cell.is-leaf {
  border-color: rgba(var(--base), 0.05);
}
body .el-table--border::after,
body .el-table--group::after,
body .el-table::before {
  background-color: rgba(var(--base), 0.05);
}
body .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
  background-color: rgba(var(--base), 0.05);
}
body .el-table .el-table__cell {
  color: rgba(var(--base), 0.8);
}
body .el-table .el-table__inner-wrapper::before {
  background-color: var(--text-color-disabled);
}
body .el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: var(--color-primary);
  color: #fff;
}
body .el-pagination.is-background .el-pager li:not(.disabled):hover {
  color: var(--color-primary);
}
body .el-pagination.is-background .btn-next,
body .el-pagination.is-background .btn-prev,
body .el-pagination.is-background .el-pager li {
  background-color: transparent;
}
body .el-tabs .el-tabs--card > .el-tabs__header .el-tabs__nav,
body .el-tabs .el-tabs--card > .el-tabs__header .el-tabs__item,
body .el-tabs .el-tabs--card > .el-tabs__header .el-tabs__item.is-active,
body .el-tabs .el-tabs--card > .el-tabs__header {
  border-color: rgba(var(--base), 0.1);
}
body .el-tabs .el-tabs__item {
  color: var(--color-text-regular);
}
body .el-tabs .el-tabs__item.is-active,
body .el-tabs .el-tabs__item:hover {
  color: var(--color-primary);
}
body .el-tabs .el-tabs__active-bar {
  background-color: var(--color-primary);
}
body .el-menu {
  background: var(--background-color-base);
  border-right-color: rgba(var(--base), 0.1);
}
body .el-menu .el-menu-item {
  color: var(--color-text-regular);
  transition-duration: 0.3s;
  border-radius: 0 30px 30px 0;
}
body .el-menu .el-menu-item + .el-menu-item {
  margin-top: 2px;
}
body .el-menu .el-menu-item:hover,
body .el-menu .el-menu-item.is-active {
  background-color: var(--color-primary);
  color: var(--color-text-primary);
}
body .el-link.el-link--info {
  --el-link-text-color: rgba(var(--base), 0.8);
  --el-link-hover-text-color: var(--color-primary);
  text-decoration: none;
}
body .el-link.el-link--info.is-underline:hover:after {
  border-color: var(--el-link-hover-text-color);
}
body .el-input-group {
  --el-border-color: rgba(var(--base), 0.1);
  --el-text-color-disabled: rgba(var(--base), 0.08);
}
body .el-input-group__append,
body .el-input-group__prepend {
  background-color: transparent;
}
body .el-switch__core {
  --el-switch-off-color: var(--color-primary);
  --el-switch-on-color: var(--color-text-placeholder);
}
